@extends('layouts.template')

@section('title', '完善个人信息')

@section('content')
<script src="{{asset('dist/auth/register.js')}}"></script>
<script>
    var redirectUrl = '{{$redirectUrl}}';
</script>
<article class="conter">
    <form id="form" v-cloak>
        <input type="hidden" name="weixinUserId" value="{{$weixinUserId}}" />
        <ul class="login">
            <li v-show="false"><span><i>*</i>手机号码</span><input type="text" class="txt1" value="{{$phoneNum}}" name="phoneNum" @click.prevent="changePhone"></li>
            <li><span><i>*</i>真实姓名</span><input type="text" class="txt1" placeholder="请填写真实姓名" name="realName"></li>
            <li><span><i>*</i>身份证号</span><input type="text" class="txt1" placeholder="请输入身份证号" name="idcardNum"></li>
            <li><span><i>*</i>所在省市区</span>
                <area-selector name="areaId" @select-province="selectProvince" @select-city="selectCity"/>
            </li>

            <li><span><i>*</i>服务区域</span>
                <input type="text" class="txt1" placeholder="请选择能够服务的区域" id="serviceAreaIds" @focus="changingServiceAreaIds=true" :value="selectedServiceAreaIds">
            </li>
            <li class="checkbox02" v-show="changingServiceAreaIds">
                <div v-if="serviceAreas.length == 0" class="checkbox01">
                    请先选择所在省市
                </div>
                <div v-else class="checkbox01">
                    <label v-for="serviceArea in serviceAreas"><span><input type="checkbox" name="serviceAreaIds[]" @click="selectServiceAreaIds" :value="serviceArea.id" :data-text="serviceArea.name" /> @{{serviceArea.name}}</span></label>
                </div>
                <div style="height:1px;clear:both"></div>
            </li>

            <li><span><i>*</i>服务类目</span><select class="txt1" name="serviceCategory"><option value="">请选择服务类目</option><option value="1" selected="selected">家具类</option></select></li>

            <li><span><i>*</i>服务类型</span>
                <input type="text" class="txt1" placeholder="请选择服务类型" id="serviceType" @focus="changingServiceTypes=true" :value="selectedServiceTypes">
            </li>
            <li class="checkbox02" v-show="changingServiceTypes">
                <div class="checkbox01">
                    <label><span><input type="checkbox" name="serviceTypes[]" @click="selectServiceTypes" value="1" data-text="配送" /> 配送</span></label>
                    <label><span><input type="checkbox" name="serviceTypes[]" @click="selectServiceTypes" value="4" data-text="搬运" /> 搬运</span></label>
                    <label><span><input type="checkbox" name="serviceTypes[]" @click="selectServiceTypes" value="2" data-text="安装" /> 安装</span></label>
                    <label><span><input type="checkbox" name="serviceTypes[]" @click="selectServiceTypes" value="3" data-text="维修" /> 维修</span></label>
                </div>
                <div style="height:1px;clear:both"></div>
            </li>
        </ul>

        <article class="photo_sfz overflow_h">
            <h3><i>*</i>请上传本人身份在进行实名认证</h3>
            <p>温馨提示提现账户必须与身份姓名一致，请务必使用本人身份证</p>
            <ul class="addphoto">
                <li><img src="{{asset('images/sfz_bg.png')}}" @click="idcardImage">
                    <input type="hidden" name="idcardFront" />
                    <p>正面<br />身份证照片</p></li>
                <li><img src="{{asset('images/sfz_bg.png')}}" @click="idcardImage">
                    <input type="hidden" name="idcardBack" />
                    <p>背面<br />身份证照片</p></li>
                <li><img src="{{asset('images/sfz_bg.png')}}" @click="idcardImage">
                    <input type="hidden" name="idcardHold" />
                    <p>半身手持<br />身份证照片</p></li>
            </ul>
        </article>

        <a v-if="!submiting" class="okbtn" id="submit" @click="submit">确认提交</a>
        <a v-else class="okbtn">提交中...</a>
    </form>

</article>
@endsection